使用 Electron Forge 创建 Electron 工程

Electron Forge 是一个一站式的工具，可以打包和发布 Electron 应用。它集成了许多单一用途的包，创建了一个完整的构建流程，支持代码签名、安装程序和制品发布。它还提供了一个可扩展的接口，可以方便地使用不同的模板、插件和配置。

React with TypeScript

文档：React with TypeScript - Electron Forge

使用Electron Forge、React和TypeScript创建一个Electron应用。四步：

  1. 创建应用
  2. 设置TypeScript配置
  3. 安装React和相关依赖
  4. 修改代码和运行应用

创建应用

yarn create electron-app my-new-app --template=webpack-typescript

设置TypeScript配置

then edit the newly created tsconfig.json to add the key-value entry "jsx": "react-jsx" to the "compilerOptions" section.

安装React和相关依赖

Add the basic React packages to your dependencies and the corresponding types to your devDependencies:

yarn add react react-dom

yarn add --dev @types/react @types/react-dom

修改代码和运行应用

You should now be able to start writing and using React components in your Electron app. The following is a very minimal example of how to start to add React code:

src/app.tsx:

import * as ReactDOM from 'react-dom';

function render() {
  ReactDOM.render(<h2>Hello from React!</h2>, document.body);
}

render();

src/renderer.ts:

// Add this to the end of the existing file
import './app';

网络资源

本文作者：Maeiee

本文链接：使用 Electron Forge 创建 Electron 工程

版权声明：如无特别声明，本文即为原创文章，版权归 Maeiee 所有，未经允许不得转载！

喜欢我文章的朋友请随缘打赏，鼓励我创作更多更好的作品！